<script setup lang="ts">
import { ref, onMounted } from "vue";
import router from "@/router";
import { useRoute } from "vue-router";
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
import { useSystemStoreWithOut } from "@/store/modules/system";
import { storeToRefs } from "pinia";
import { adjustTypeList } from "@/utils/staticData";
import { useMessage } from "@/hooks/useMessage";
import { getDictList } from "@/api/dict";

const { createConfirm } = useMessage();
const systemStore = useSystemStoreWithOut();
const { warehouseList } = storeToRefs(systemStore);
const multiTagsStore = useMultiTagsStoreHook();
const route = useRoute();
const props = defineProps({
  preWarehouseCode: {
    type: String,
    default: ""
  },
  rows: {
    type: Number,
    default: 0
  }
});
const emits = defineEmits(["update:preWarehouseCode"]);
const form = ref({
  adjustType: "", // 调整类型
  warehouseCode: "", // 仓库名称
  adjustCode: "", // 调整单号
  memo: "", // 备注
  incrStockType: "", // 调增库存类型
  decrStockType: "" // 调减库存类型
});
const stockTypeList = ref([]);

const goBack = () => {
  multiTagsStore.handleTags("splice", route.path);
  router.back();
};

const handleWarehouseChange = (val: string | number) => {
  if (props.rows && !!props.preWarehouseCode) {
    createConfirm({
      message: "更换仓库后，将清空现有物料明细列表中的内容，是否继续？",
      center: false
    })
      .then(() => {
        emits("update:preWarehouseCode", val);
      })
      .catch(() => {
        form.value.warehouseCode = props.preWarehouseCode;
      });
  } else {
    emits("update:preWarehouseCode", val);
  }
};

onMounted(() => {
  getDictList({ dictCode: "STOCK_TYPE" }).then(res => {
    stockTypeList.value = res.data || [];
  });
});

defineExpose({
  getForm: () => {
    return form.value;
  }
});
</script>

<template>
  <div class="applyForm">
    <div class="flex items-center justify-between flex-row pb-[16px]">
      <p class="text-[16px] font-bold">调整信息管理</p>
      <el-button @click="goBack"
        ><svg-icon name="rollback" size="16" />&nbsp;返回</el-button
      >
    </div>
    <el-form class="mb-[-16px]" :model="form" inline>
      <el-form-item label="调整类型" prop="adjustType">
        <el-select
          v-model="form.adjustType"
          filterable
          placeholder="请输入"
          clearable
        >
          <el-option
            v-for="(item, index) in adjustTypeList"
            :key="index"
            v-bind="item"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="仓库名称" prop="warehouseCode">
        <el-select
          v-model="form.warehouseCode"
          filterable
          placeholder="请输入"
          clearable
          @change="handleWarehouseChange"
        >
          <el-option
            v-for="(item, index) in warehouseList"
            :key="index"
            :value="item.warehouseCode"
            :label="item.warehouseName"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="调整单号" prop="adjustCode">
        <el-input
          v-model="form.adjustCode"
          disabled
          placeholder="系统自动带入"
        />
      </el-form-item>
      <el-form-item label="调增库存类型" prop="incrStockType">
        <el-select
          v-model="form.incrStockType"
          filterable
          placeholder="请输入"
          clearable
        >
          <el-option
            v-for="(item, index) in stockTypeList"
            :key="index"
            :value="item.dictLabelValue"
            :label="item.dictLabelName"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="调减库存类型" prop="decrStockType">
        <el-select
          v-model="form.decrStockType"
          filterable
          placeholder="请输入"
          clearable
        >
          <el-option
            v-for="(item, index) in stockTypeList"
            :key="index"
            :value="item.dictLabelValue"
            :label="item.dictLabelName"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="备注" prop="memo">
        <el-input
          v-model="form.memo"
          type="textarea"
          placeholder="请输入内容"
          maxlength="500"
        />
      </el-form-item>
    </el-form>
  </div>
</template>
<style scoped lang="scss">
.applyForm {
  overflow: hidden;
  .el-textarea {
    --el-textarea-height: 32px;
  }
  .error-tag {
    display: inline-flex;
    width: 17.5px;
    height: 17.5px;
    border-radius: 17.5px;
    background-color: #ed7b2f;
    color: #fff;
    font-size: 12px;
    align-items: center;
    justify-content: center;
    font-style: normal;
  }
  .tag {
    line-height: 36px;
    font-style: normal;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.6);
  }
}
</style>
